<template>
    <div>
        <group title="基本信息">
            <x-input
                    v-model="form.real_name"
                    is-type="china-name"
                    title="姓名"
                    placeholder="请输入您的真实姓名"
            />
            <popup-radio
                    v-model="form.sex"
                    :options="init.sex"
                    title="性别"
            />
        </group>

        <group title="联系方式">
            <x-input
                    v-model="form.emails"
                    is-type="email"
                    title="邮箱"
                    placeholder="请输入您常用的邮箱地址"
            />
            <x-input
                    v-model="form.phone"
                    type="number"
                    is-type="china-mobile"
                    title="手机号码"
                    placeholder="请输入您常用的手机号码"
            />
        </group>

        <group title="其他">
            <x-input
                    v-model="form.native"
                    title="籍贯"
                    placeholder="请输入您的籍贯"
            />
        </group>

        <group title="教育背景">
            <popup-radio
                    v-model="form.background"
                    :options="init.background"
                    title="学历"
            />
            <x-input
                    v-model="form.graduate_school"
                    title="毕业学校"
                    placeholder="请输入就读院校名称"
            />
            <x-input
                    v-model="form.major"
                    title="专业"
                    placeholder="请输入就读专业名称"
            />
            <datetime
                    v-model="form.graduate_time"
                    start-date="1949-10-01"
                    :end-date="$moment().format('YYYY-MM-DD')"
                    title="毕业时间"
                    placeholder="请选择毕业时间"
            />
        </group>

        <div style="padding: 1rem;">
            <x-button
                    @click.native="onOk"
                    :show-loading="this.loading"
                    type="primary"
                    action-type="button"
            >提交
            </x-button>
            <x-button
                    :show-loading="this.loading"
                    link="BACK"
                    action-type="button"
            >返回
            </x-button>
        </div>

        <loading :show="loading" text="玩命提交中"/>
    </div>
</template>

<script>
    import {
        Datetime,
        Group,
        Loading,
        PopupPicker,
        PopupRadio,
        Toast,
        XButton,
        XInput
    } from 'vux';
    import eventBus from '@/event-bus';

    const PROFILE_STORAGE_KEY = 'profile_storage_key';
    const TO_BE_SUBMIT_JOBS_STORAGE_KEY = 'to_be_submit_jobs_storage_key';

    export default {
        name: 'EditProfile',
        components: {
            Datetime,
            Group,
            Loading,
            PopupPicker,
            PopupRadio,
            Toast,
            XButton,
            XInput
        },

        created() {
            this.readProfile();
            this.readToBeSubmitJobs();
        },

        beforeDestroy() {
            this.saveProfile();
        },

        data() {
            return {
                init: {
                    background: [
                        {
                            value: '高中',
                            key: 1
                        },
                        {
                            value: '大专',
                            key: 2
                        },
                        {
                            value: '本科',
                            key: 3
                        },
                        {
                            value: '双学位',
                            key: 4
                        },
                        {
                            value: '硕士',
                            key: 5
                        },
                        {
                            value: '博士',
                            key: 6
                        }
                    ],

                    sex: [
                        {
                            key: 0,
                            value: '男'
                        },
                        {
                            key: 1,
                            value: '女'
                        }
                    ]
                },

                form: {
                    real_name: '', // 姓名
                    sex: 0, // 性别
                    emails: '', // 邮箱(唯一)
                    phone: '', // 手机号(唯一)
                    native: '', // 籍贯
                    graduate_school: '', // 毕业学校
                    background: 3, // 学历
                    major: '', // 专业
                    graduate_time: '', // 毕业时间
                    jobs_list: [], // 投递的职位 id 列表
                    source: 1 // 简历来源渠道的 id
                },

                loading: false,

                toBeSubmitJobs: []
            };
        }, // data()

        methods: {
            onOk() {
                this.loading = true;
                this.$API.applicantRegister.register(this.formatParams())
                    .then(() => {
                        this.$router.push({path: '/resume-edit'});
                    }, err => {
                        console.log(err);
                        let message = '未知错误';
                        if (err[0]) {
                            message = err[0].split(':')[1] ? err[0].split(':')[1] : err[0];
                        }
                        this.showMessage(message, 'cancel');
                    })
                    .finally(() => {
                        this.loading = false;
                    });
            },

            formatParams() {
                let params = this.$clonedeep(this.form);
                params.jobs_list = this.toBeSubmitJobs.map(item => item.id);
                return params;
            },

            saveProfile() {
                localStorage.setItem(PROFILE_STORAGE_KEY, JSON.stringify(this.form));
            },

            readProfile() {
                let profile = localStorage.getItem(PROFILE_STORAGE_KEY);
                if (profile) {
                    this.form = JSON.parse(profile);
                }
            },

            readToBeSubmitJobs() {
                let toBeSubmitJobs = sessionStorage.getItem(TO_BE_SUBMIT_JOBS_STORAGE_KEY);
                if (toBeSubmitJobs) {
                    this.toBeSubmitJobs = JSON.parse(toBeSubmitJobs);
                }
            },

            // toast 消息
            showMessage(message = 'message', type = 'text') {
                eventBus.$emit('on-show-message', {message, type});
            }
        }
    };
</script>
